<script setup lang="ts">
import { defineProps, defineEmits } from 'vue'
// 批量操作栏组件
interface Task {
  id: number
  message: string
  isCompleted: boolean
  category: string
  selected?: boolean  
  isEditing?: boolean  
  editTemp?: string 
}

const props = defineProps({
  selectedList: {
    type: Array<Task>,
    required: true
  },
  hasCompletedSelected: {
    type: Boolean,
    required: true
  }
})

const emit = defineEmits(['complete-selected', 'delete-selected'])
</script>

<template>
  <transition name="fade">
    <div class="batch-bar">
      <span>已选 {{ selectedList.length }} 条</span>
      <button v-if="!hasCompletedSelected" @click="emit('complete-selected')">完成</button>
      <button @click="emit('delete-selected')">删除</button>
    </div>
  </transition>
</template>